aboutsummaryrefslogtreecommitdiff
path: root/src/app/manga/[title]/[id]/[read]/page.jsx
blob: a2b2555fb272bdf84a85cf47e749e1cfb9eabc9b (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
import styles from "./read.module.css";
import Image from "next/image";

export default async function Read({ params }) {
	const chapterId = params.read;
	const results = await getPages(chapterId);
	const image_base_url = results.baseUrl + "/data/" + results.chapter.hash;

	if (results.length === 0) {
		return (
			<div className={styles.NotFound}>
				<p>
					This chapter has no content. Please check the next chapter.
				</p>
			</div>
		);
	}

	let images = [];
	for (var i = 0; i < results.chapter.data.length; i++) {
		var imgUrl = image_base_url + "/" + results.chapter.data[i];
		images.push(imgUrl);
	}

	return (
		<div className={styles.Main}>
			<div className={styles.ImageContainer}>
				<p>Total pages: {images.length}</p>
				{images &&
					images.map((item, index) => (
						<div className={styles.Image} key={index}>
							<Image
								src={`https://sup-proxy.zephex0-f6c.workers.dev/api-content?url=${item}&headers=https://mangadex.org`}
								key={index}
								alt="Pages"
								width={800}
								height={1000}
								priority
								quality={100}
								unoptimized
							/>
							<p>Page: {index + 1}</p>
						</div>
					))}
			</div>
		</div>
	);
}

async function getPages(id) {
	const res = await fetch(`https://api.mangadex.org/at-home/server/${id}`);
	const data = await res.json();
	return data;
}